<!-- 
    知识回顾:
        html
          => 概念：超文本标记语言
          => 作用：负责网页结构内容
          => 语法: <开始标签>内容</结束标签>
                   <标签/>    
                   <h1>标题</h1>  <br/>

          => 学习html就是学习html标签元素
             h1-h6   p    img  a   ul li  ol li  table  input form ...
        
        css 
          =>概念:  层叠样式表
          =>作用: 负责网页外观，美化网页
          =>语法:
                  选择器{
                     样式名：样式值;
                     样式名：样式值;
                  }    
          => 学习css就是学习 选择器和样式
         
          选择器
             => 选中html标签元素的方式方法
    
             => 基础选择器
                   标签选择器
                   ID选择器
                   class 类选择器
                高级选择器
                   层次选择器
                    M N  M>N  M+N  M~N
                   伪类选择器
                    N:nth-child(n)
                   属性选择器
                    M[attr]  M[attr=value]
                通用 * 
          => 常用样式
                字体样式: font-size  font-weight  font-family  font-style
                文本样式: color  text-align  text-indent  text-decoration
                背景样式: background-color background-image  bacckground-reapt  background-postion
                         background-size:   cover contain
                列表:    list-style:none
                圆角：   border-radius

          => 盒子模型
                每个html标签元素都可以看作是一个盒子，都具有盒子相关特性。
                  width  height  border padding margin
                  
            
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>标题</h1>
    <div>
        <ul>
            <li>元素1</li>
        </ul>
    </div>
</body>
</html>